.md1 {
overflow:auto;width:503px;height:200px;
font-family: "Consolas", "Courier New", Courier, mono, serif;
color:#848176;
margin : 15px 35px 15px 15px;
padding : 10px 10px 10px 35px;
clear : both;
list-style-type : none;
background : #000000 url(http://2.bp.blogspot.com/-TFas8d104Ws/TzVVWy8TOBI/AAAAAAAAIvc/relwqoKQiaU/s1600/lampu2.png) repeat-y top left;
border : 1px solid #000000;
border-left:20px solid #ccc;
-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition-duration:all .3s ease-in-out;transition:all .3s ease-in-out;-webkit-border-radius:3px;-moz-border--moz-border-radius: 23px 20px 20px 20px;border-radius: 23px 20px 20px
}
.md1:hover{
background : #000000 url(http://3.bp.blogspot.com/-9czz_Xh3bHg/TzVVDHcfoeI/AAAAAAAAIvQ/vp7CQmle7Fs/s1600/lampu1.png) repeat-y top left;
color:#FEF9BF;
border : 1px solid #000;
border-left:20px solid #ccc;
-webkit-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
-moz-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
box-shadow: 10px 10px 5px #888888;
}



.md2 {
overflow:auto;width:400px;height:auto;
font-family: "Consolas", "Courier New", Courier, mono, serif;
color:#7A6417;
margin : 15px 35px 15px 15px;
padding : 10px 10px 10px 35px;
clear : both;
list-style-type : none;
background : #000000 url(http://1.bp.blogspot.com/-rkGCWhIBtlI/TzVgPsX_7YI/AAAAAAAAIww/umZzqF2bwdE/s1600/000.JPG) repeat-y top left;
border : 1px solid #D8C37D;
-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition-duration:all .3s ease-in-out;transition:all .3s ease-in-out;-webkit-border-radius:3px;-moz-border--moz-border-radius: 23px 20px 20px 20px;border-radius: 23px 20px 20px
}
.md2:hover{
border : 1px solid #D8C37D;
-webkit-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
-moz-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
-moz-border-radius: 23px 20px 20px 20px;border-radius: 23px 20px 20px
}

.md3 {
overflow:auto;width:250px;height:260px;
font-family: "Consolas", "Courier New", Courier, mono, serif;
color:#000000;
margin : 15px 35px 15px 15px;
padding : 15px 5px 10px 165px;
clear : both;
list-style-type : none;
background : #ffffff url(http://3.bp.blogspot.com/-8GQGaJPPkos/TzVeWi89EHI/AAAAAAAAIvo/-R4rAC7PpSc/s1600/special-offer-01.jpg) repeat-y top left;
border : 1px solid #ffffff;
-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition-duration:all .3s ease-in-out;transition:all .3s ease-in-out;-webkit-border-radius:3px;-moz-border--moz-border-radius: 23px 20px 20px 20px;border-radius: 23px 20px 20px
}
.md3:hover{
background : #ffffff url(http://1.bp.blogspot.com/-YzoaI6NnqTY/TzVejPPhhhI/AAAAAAAAIv0/Pd9G2dLApbc/s1600/special-offer-02.png) repeat-y top left;
color:#000000;
border : 1px solid #ffffff;
-webkit-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
-moz-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
}



.md4 {
overflow:auto;width:450px;height:153px;
font-family: "Consolas", "Courier New", Courier, mono, serif;
color:#848176;
margin : 15px 35px 15px 15px;
padding : 10px 10px 10px 35px;
clear : both;
list-style-type : none;
background : #000000  repeat-y top left;
border : 1px  solid #000000;
border-left:20px solid #ccc;
-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition-duration:all .3s ease-in-out;transition:all .3s ease-in-out;-webkit-border-radius:3px;-moz-border--moz-border-radius: 23px 20px 20px 20px;border-radius: 23px 20px 20px
}
.md4:hover{
overflow:auto;width:450px;height:153px;
background : #000000 url(http://1.bp.blogspot.com/-r7005wBwn4w/TzVey4KCOdI/AAAAAAAAIwA/WQ3uLyTTs6Q/s1600/mata.JPG) repeat-y top left;
color:#eee;
text-shadow:1px 1px 1px #000;
text-transform: capitalize;
border : 1px solid #000000;
border-left:20px solid #CCC;
-webkit-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
-moz-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
}

.md5 {
overflow:auto;width:400px;height:auto;
font-family: "Consolas", "Courier New", Courier, mono, serif;
margin : 15px 35px 15px 15px;
padding : 10px 10px 10px 60px;
clear : both;
color:#000;
list-style-type : none;
background : #F5F3F3 url(http://4.bp.blogspot.com/-bSEyGK5p3FM/TzVe9XhfqXI/AAAAAAAAIwM/lUnUgYEcpws/s1600/kertas.JPG) repeat-y top left;
border : 1px solid #ccc;
border-right:15px solid rgba(0, 0, 0, .100);
-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition-duration:all .3s ease-in-out;transition:all .3s ease-in-out;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;
-webkit-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
-moz-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
}
.md5:hover{
overflow:auto;width:400px;height:auto;
background : #F5F3F3 url(http://4.bp.blogspot.com/-bSEyGK5p3FM/TzVe9XhfqXI/AAAAAAAAIwM/lUnUgYEcpws/s1600/kertas.JPG) repeat-y top left;
border : 1px solid #ccc;
border-right:15px solid rgba(0, 0, 0, .100);
-webkit-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
-moz-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
}



.md6 {
overflow:auto;width:400px;height:auto;
font-family: "Consolas", "Courier New", Courier, mono, serif;
margin : 15px 35px 15px 15px;
padding : 10px 10px 10px 35px;
clear : both;
color:000:
list-style-type : none;
background :#6D6C6A;
border : 1px solid #EEEEEE;
border-left:20px solid #000;
border-right:20px solid #000;
-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition-duration:all .3s ease-in-out;transition:all .3s ease-in-out;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;
-moz-border--moz-border-radius: 23px 20px 20px 20px;border-radius: 23px 20px 20px;
-webkit-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
-moz-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
}
.md6:hover{
background : #000;
color:#fff;
border : 1px solid #EEEEEE;
border-left:20px solid #6D6C6A;
border-right:20px solid #6D6C6A;
-webkit-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
-moz-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
}


.md7
{
color:#848176;
overflow:hidden;width:200px;height:300px;
background:black;
margin : 15px 35px 15px 15px;
padding : 10px 10px 10px 35px;
clear : both;
border : 1px solid #000000;
border-left:10px solid #ccc;
border-right:10px solid #ccc;
list-style-type : none;
transition:width 2s;
text-position:fixed;
-moz-transition:width 2s; /* Firefox 4 */
-webkit-transition:width 2s; /* Safari and Chrome */
-o-transition:width 2s; /* Opera */
box-shadow: 10px 10px 5px #888888;
}

.md7:hover
{
width:300px;
color:#fff;
box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
}


.md8 {
margin : 15px 35px 15px 15px;
padding : 20px 10px 10px 35px;
background : #EEEEEE url(http://4.bp.blogspot.com/-aTRzuS6M9uw/TzVfGtQiyBI/AAAAAAAAIwY/W1hcFKnFuBA/s1600/kertas1.gif) repeat-y top left;
border-top : 1px solid #AAAAAA;
border-right : 1px solid #AAAAAA;
border-bottom : 1px solid #AAAAAA;
border-left : 1px solid #AAAAAA;
}


.md9{
overflow:auto;width:570px;height:310px;
font-family: "Consolas", "Courier New", Courier, mono, serif;
margin : 15px 15px 15px 15px;
padding : 20px 10px 0px 35px;
clear : both;
color:#ffffff;
list-style-type : none;
background : #F7F7F7 url(http://1.bp.blogspot.com/-8wil-AtiwE0/TzViW_CxBjI/AAAAAAAAIxc/uAfFo63C84Q/s1600/copy-to-clipboard-cmd-3.png) repeat-y top left;
border : 1px solid #EEEEEE;
-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition-duration:all .3s ease-in-out;transition:all .3s ease-in-out;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;

}
.md9:hover{
background : #FFFFFF url(http://1.bp.blogspot.com/-8wil-AtiwE0/TzViW_CxBjI/AAAAAAAAIxc/uAfFo63C84Q/s1600/copy-to-clipboard-cmd-3.png) repeat-y top left;
border : 1px solid #EEEEEE;
-webkit-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
-moz-box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
box-shadow: 0px 0px 10px  rgba(0, 0, 0, .3);
}

.md-9{
overflow:auto;width:542px;height:230px;
font-family: "Consolas", "Courier New", Courier, mono, serif;
margin : 15px 15px 15px 15px;
padding : 20px 10px 0px 0px;
clear : both;
color:#96948A;
list-style-type : none;
background : #000 ;
border : 1px solid #000;
-webkit-transition:all .3s ease-in-out;-moz-transition:all .3s ease-in-out;-o-transition-duration:all .3s ease-in-out;transition:all .3s ease-in-out;-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px;

}